<template>
    <el-container>
      <el-header>
        <topNavbar :path="path" :title="title" :content="content"></topNavbar>
      </el-header>

      <el-main>
        <orderDetail :is_company="is_company" ref="matter" :order_id="id">

          <template #order_1>
            <el-form-item v-if="!is_join">
              <el-button type="primary" @click="is_join = 1">参与</el-button>
              <el-button type="danger">放弃</el-button>
              <el-button type="info">返回</el-button>
            </el-form-item>

            <el-form-item v-else>
              <el-button type="primary" @click="changeMatter">立即提交</el-button>

              <el-upload
                class="upload-demo"
                :action="upload_url"
                :on-success="handleExceed"
                :file-list="fileList"
                :show-file-list="false"
                :data="params"
              >
                <el-button type="primary">上传附件</el-button>
              </el-upload>


              <el-button type="info" @click="is_join = 0">返回</el-button>
            </el-form-item>

          </template>
        </orderDetail>
      </el-main>
    </el-container>
</template>

<script>
  import topNavbar from "../common/topNavbar";
  import orderDetail from "../common/orderDetail";
  import {mapActions} from 'vuex'
  import {editMatter} from '@/apilist/Supplier'
    export default {
        name: "requestDetail",
        data(){
            return {
                path: '/supplier/projectRequest',
                id: 0,
                content: '',
                is_join:0,
               is_company:0,
                title: '项目需要',
                matterData: {},
                fileList: [],
                upload_url: this.fun.APP_VUE_UPLOAD_URL,
                params: {dir:'order',name:'files'},

            }
        },
        components: {topNavbar,orderDetail},

        methods: {
            ...mapActions("Order",['getOrderActions']),
            setQuery(){
                this.content = this.$route.query.name
                this.id = this.$route.query.id
                this.is_join = this.$route.query.hasOwnProperty('is_join') ?  this.$route.query.is_join : 0
            },
            changeMatter()
            {
                let matterData = this.$refs.matter.form
                matterData['order_id'] = this.id
                if(this.fileList.length > 0){
                    matterData['files'] = this.fileList
                }
                console.log(matterData)
                editMatter(matterData).then(res => {
                    if(res.state == 'ok'){
                        this.$message({
                            type: "success",
                            message: res.msg,
                            onClose: () => {
                                this.getOrderActions({id: this.id})
                            }
                        })
                    }
                });

            },

            handleExceed(response, file, fileList)
            {
                this.fileList.push(response.data)
            }

        },

        mounted() {
            this.setQuery()
            let order_id = this.$route.query.id
        }

    }
</script>

<style scoped>
.upload-demo{
  display: inline-block;
  text-align: left !important;
}
</style>
